"ui";
//变量定义
var ColoredButton = (function() {
    //继承ui.Widget
    util.extend(ColoredButton, ui.Widget);

    function ColoredButton() {
        //调用父类构造函数
        ui.Widget.call(this);
        //自定义属性color，定义按钮颜色
        this.defineAttr("color", (view, name, defaultGetter) => {
            return this._color;
        }, (view, name, value, defaultSetter) => {
            this._color = value;
            view.attr("backgroundTint", value);
        });
        //自定义属性onClick，定义被点击时执行的代码
        this.defineAttr("onClick", (view, name, defaultGetter) => {
            return this._onClick;
        }, (view, name, value, defaultSetter) => {
            this._onClick = value;
        });
    }
    ColoredButton.prototype.render = function() {
        return (
            <button textSize="16sp" style="Widget.AppCompat.Button.Colored" />
        );
    }
    ColoredButton.prototype.onViewCreated = function(view) {
        view.on("click", () => {
            if (this._onClick) {
                eval(this._onClick);
            }
        });
    }
    ui.registerWidget("colored-button", ColoredButton);
    return ColoredButton;
})();
//函数定义:随机颜色(没用这个函数，本来想五颜六色的琴键的，结果并不好看)
function randomColor() {
    str = "#"
    for (i = 0; i < 6; i++) {
        num = Math.ceil(Math.random() * 15)
        if (num === 10) {
            chr = "a"
        } else if (num == 11) {
            chr = "b"

        } else if (num == 12) {
            chr = "c"

        } else if (num == 13) {
            chr = "d"

        } else if (num == 14) {
            chr = "e"

        } else if (num == 15) {
            chr = "f"

        } else {
            chr = num.toString()
        }
        str = str + chr
    }
    return str
}
//函数定义:媒体播放琴音
function music(letter) {
    filepath = "./res/musics/piano" + (letter.charCodeAt(0) - 64).toString() + ".mp3"
    threads.start(function() {
        //播放音乐
        media.playMusic(filepath);
        //让音乐播放完
        sleep(media.getMusicDuration());
    })
}
//函数定义:琴键click监听函数,ui.A.on("click",()={})
function lisOnCl() {
    ui.statusBarColor("#00000000");
    ui.opernOn.on("click", () => {
        ui.opern.setText(files.read("./res/lyric/lyric.txt"));
    })
    ui.opernOff.on("click", () => {
        ui.opern.setText("");
    })
    ui.ltbili.on("click", () => {
        app.startActivity({
            action: "VIEW",
            data: "https://space.bilibili.com/166269644/dynamic"
        });

    })
    ui.ltgitee.on("click", () => {
        app.startActivity({
            action: "VIEW",
            data: "https://gitee.com/liutong1997"
        });

    })
    for (n = 65; n < 91; n++) {
        codestring = 'ui.' + String.fromCharCode(n) + '.on("click", () => {music("' + String.fromCharCode(n) + '")});'
        if (n == 82) {
            codestring = 'ui.' + String.fromCharCode(n) + 'key.on("click", () => {music("' + String.fromCharCode(n) + '")});'
        }
        eval(codestring)
    }
}
//字母顺序界面加载
function orderui() {
    ui.layout(
        <vertical>
            <vertical layout_weight="120">
                <ScrollView>
                    <text id="opern">
                    </text>
                </ScrollView>
            </vertical>
            <vertical layout_weight="1">
                <horizontal >
                    <colored-button id="A" text="A" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="B" text="B" layout_weight="1" color="black" />
                    <colored-button id="C" text="C" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="D" text="D" layout_weight="1" color="black" />
                    <colored-button id="E" text="E" textColor="black" layout_weight="1" color="white" />
                </horizontal>
                <horizontal >
                    <colored-button id="F" text="F" layout_weight="1" color="black" />
                    <colored-button id="G" text="G" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="H" text="H" layout_weight="1" color="black" />
                    <colored-button id="I" text="I" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="J" text="J" layout_weight="1" color="black" />
                </horizontal>
                <horizontal >
                    <colored-button id="K" text="K" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="L" text="L" layout_weight="1" color="black" />
                    <colored-button id="M" text="M" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="N" text="N" layout_weight="1" color="black" />
                    <colored-button id="O" text="O" textColor="black" layout_weight="1" color="white" />
                </horizontal>
                <horizontal >
                    <colored-button id="P" text="P" layout_weight="1" color="black" />
                    <colored-button id="Q" text="Q" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="Rkey" text="R" layout_weight="1" color="black" />
                    <colored-button id="S" text="S" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="T" text="T" layout_weight="1" color="black" />
                </horizontal>
                <horizontal >
                    <colored-button id="U" text="U" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="V" text="V" layout_weight="1" color="black" />
                    <colored-button id="W" text="W" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="X" text="X" layout_weight="1" color="black" />
                    <colored-button id="Y" text="Y" textColor="black" layout_weight="1" color="white" />
                </horizontal>
                <horizontal >
                    <colored-button layout_weight="1" id="Z" text="Z" color="black" />
                    <colored-button layout_weight="1" id="opernOn" textColor="black" text="打开曲谱" color="white" />
                    <colored-button layout_weight="1" id="opernOff" text="关闭曲谱" color="black" />
                    <colored-button layout_weight="1" id="ltbili" textColor="black" text="作者B站" color="white" />
                    <colored-button layout_weight="1" id="ltgitee" text="作者gitee" color="black" />
                    <colored-button layout_weight="1" id="change" textColor="black" text="切换布局" color="white" />
                </horizontal>
            </vertical>
        </vertical>
    )
    lisOnCl()
    ui.change.on("click", () => {
        keyboardui()
    })
}
//键盘界面加载
function keyboardui() {
    ui.layout(
        <vertical>
            <vertical layout_weight="120">
                <ScrollView>
                    <text id="opern">
                    </text>
                </ScrollView>
            </vertical>
            <vertical layout_weight="1">
                <horizontal >
                    <colored-button id="Q" text="Q" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="W" text="W" layout_weight="1" color="black" />
                    <colored-button id="E" text="E" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="Rkey" text="R" layout_weight="1" color="black" />
                    <colored-button id="T" text="T" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="Y" text="Y" layout_weight="1" color="black" />
                    <colored-button id="U" text="U" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="I" text="I" layout_weight="1" color="black" />
                    <colored-button id="O" text="O" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="P" text="P" layout_weight="1" color="black" />
                </horizontal>
                <horizontal >
                    <colored-button id="A" text="A" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="S" text="S" layout_weight="1" color="black" />
                    <colored-button id="D" text="D" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="F" text="F" layout_weight="1" color="black" />
                    <colored-button id="G" text="G" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="H" text="H" layout_weight="1" color="black" />
                    <colored-button id="J" text="J" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="K" text="K" layout_weight="1" color="black" />
                    <colored-button id="L" text="L" textColor="black" layout_weight="1" color="white" />
                </horizontal>
                <horizontal >
                    <colored-button id="Z" text="Z" layout_weight="1" color="black" />
                    <colored-button id="X" text="X" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="C" text="C" layout_weight="1" color="black" />
                    <colored-button id="V" text="V" textColor="black" layout_weight="1" color="white" />
                    <colored-button id="B" text="B" layout_weight="1" color="black" />
                    <colored-button id="N" text="N" textColor="black" layout_weight="1" color="white" />
                    <colored-button layout_weight="1" id="M" text="M" color="black" />
                </horizontal>
                <horizontal >
                    <colored-button layout_weight="1" id="opernOn" textColor="black" text="打开曲谱" color="white" />
                    <colored-button layout_weight="1" id="opernOff" text="关闭曲谱" color="black" />
                    <colored-button layout_weight="1" id="ltbili" textColor="black" text="作者B站" color="white" />
                    <colored-button layout_weight="1" id="ltgitee" text="作者gitee" color="black" />
                    <colored-button layout_weight="1" id="change" textColor="black" text="切换布局" color="white" />
                </horizontal>
            </vertical>
        </vertical>
    )
    lisOnCl()
    ui.change.on("click", () => {
        orderui()
    })
}

//运行代码
orderui()